// import React from "react";
import React from "./react";
const ReactContext = React.createContext()
console.log(ReactContext)
const reducer = (state,action)=>{
  switch (action.type) {
    case 'ADD':
      return {number:state.number+1};
    case 'MINUS':
      return {number:state.number-1}
    default:
      return state;
  }

}

function Child (){
  const {dispatch} = React.useContext(ReactContext)
  return <div>
    <button onClick={()=>dispatch({type: 'ADD'})}>+</button>
    <button onClick={()=>dispatch({type: 'MINUS'})}>-</button>
  </div>
}

function App (){
  const [state, dispatch] = React.useReducer(reducer,{number:1})
  return <ReactContext.Provider value={{data:state.number,dispatch}}>
    <div>
      <p>Counter: {state.number}</p>
      <Child />
    </div>
  </ReactContext.Provider>
}
export default App